<template>
  <picker
    mode="date"
    :start="start"
    :value="selectedVal"
    @change="bindDateChange"
  >
    <input
      mode="wrapped"
      :value="selectedVal"
      placeholder="日期"
      maxlength="999999"
      disabled
    />
  </picker>
</template>

<script>
export default {
  components: {},
  props: {
    date: {
      type: String,
      required: false,
      default: ''
    }
  },
  data () {
    return {
      selectedVal: '',
      start: ''
    }
  },
  computed: {
    val () {
      if (this.selectedVal) {
        return this.selectedVal
      } else {
        return ''
      }
    }
  },
  watch: {
    date (val) {
      this.selectedVal = val
    }
  },
  created () {
    this.selectedVal = this.date
    // this.initTime()
    // this.initVal()
    this.initDate()
  },
  mounted () {},
  onShow () {
    if (this.date) {
      this.selectedVal = this.date
    } else {
      this.selectedVal = ''
    }
  },
  methods: {
    bindDateChange (e) {
      this.selectedVal = e.target.value
      this.$emit('change', this.selectedVal)
    },
    initDate () {
      var timestamp = Date.parse(new Date())
      var date = new Date(timestamp)
      // 获取年份
      var Y = date.getFullYear()
      // 获取月份
      var M =
        date.getMonth() + 1 < 10
          ? '0' + (date.getMonth() + 1)
          : date.getMonth() + 1
      // 获取当日日期
      var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
      // this.date = Y + '-' + M + '-' + D
      this.start = Y + '-' + M + '-' + D
    }
  }
}
</script>